<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学生列表</title>
    
    <link rel="stylesheet" type="text/css" href="easyui/1.3.4/themes/default/easyui.css" />
    <script type="text/javascript" src="js/axios.js"></script>
    <script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
    <script type="text/javascript" src="easyui/1.3.4/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="easyui/1.3.4/locale/easyui-lang-zh_CN.js"></script>


</head>
<body>
         <div class="search-box" style="margin: 10px 0">
        </div> 
    <table class="easyui-datagrid" id="empTable" title="" data-options="singleSelect:true,collapsible:true">
        <thead>
            <tr>
                <th data-options="field:'teacherId'">用户编号</th>
                <th data-options="field:'teacherName'">用户名称</th>
                <th data-options="field:'departmentId',width: '150'">部门号</th>
                <th data-options="field:'teacherTitle',width: '150'">用户职称</th>
                <th data-options="field:'teacherEmail',width: '200'">用户邮箱</th>
                <th data-options="field:'teacherPhone',width: '200'">用户手机号</th>
                <th data-options="field:'actions',width: '300',formatter:formatAction">操作</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </tbody>
    </table>
    <script>
        function formatAction(val,row){
            return `
                <div class="link-list" style="display: flex; align-items: center">

                    <span d_id="${row.teacherId}" style="margin: 0 5px; color: #1146a6; cursor: pointer" onclick="window.location.href='./updateUser.html?id=' + ${row.teacherId}">修改</span>

                    <div class="divider" style="height: 10px;border: 1px solid #ccc;"></div>
                    <span d_id="${row.teacherId}" onclick="deleteCurrent(${row.teacherId})" style="margin: 0 5px; color: #1146a6; cursor: pointer">删除</span>
                </div>
            `
        }
        
        const deleteCurrent = (id) => {
            axios.post("http://localhost:8080/teacher/delete?id=" + id).then(({data}) => {
                window.location.reload();
            })
        }
        
        const fetchData = () => {
            const keyword = $('#keyword').val()
            axios.get(`http://localhost:8080/de/list?keyword=${keyword}`).then(({data}) => {
                $('#empTable').datagrid({
                    data: data.data
                })
            })
        }
        
        window.onload = () => {
            axios.get('http://localhost:8080/teacher/list').then(({data}) => {
                $('#empTable').datagrid({
                    data: data.data
                })
            })
        }
    </script>
    
</body>
</html>